<template>
	<view>
		<view class="u-p-40 main-color">
			手机号请与快递信息保持一致
		</view>
		<view class="popbox u-radius-10">
			<uni-section title="选择地址" type="line">
				<uni-data-select v-model="value" :localdata="range" @change="change"></uni-data-select>
			</uni-section>
			<view class="inputbox u-p-tb-40">
				<text>用户名：</text>
				<input type="text" placeholder="请输入用户名" v-model="username" />
			</view>
			 <slot  :data="range"></slot>
			<view class="inputbox u-p-tb-40">
				<text>手机号：</text>
				<input type="text" placeholder="请输入手机号" v-model="phone" />
			</view>
			<view class="twobtn u-m-40">
				<view class="cancel main-color u-radius-10" @click="cancelclick">
					取消
				</view>
				<view class="confirm white u-radius-10 " @click="confirmclick">
					确认
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import school from '@/utils/schoole.js';
	export default {
		name:"infopop",
		data() {
			return {
				phone: '',
				value: 0,
				username: '',
				range: [],
				Park:'',
				
			};
		},
		mounted() {
			this.range = school
			this.$userinfo().then(res => {
				this.info = res.data.data
				this.username  = res.data.data.nickname
				this.phone = res.data.data.mobile
				this.value = res.data.data.Park
				this.Park = res.data.data.Park
			}).catch(err => {
				console.log(err, '失败');
			})
		},
		methods:{
			//下拉选择框
			change(e) {
				console.log(e);
				this.Park = e
			},
			//修改个人信息
			changeinfo(){
				if(!this.Park){
					this.$toast('请选择地址')
					return
				}
				if(!this.username){
					this.$toast('请填写姓名')
					return
				}
				if(!this.phone){
					this.$toast('请填写电话')
					return
				}
				this.$api.post('/user/Upmyinfo',{
					nickname:this.username,
					mobile:this.phone,
					Park:this.Park
				}).then(res=>{
					
					this.$emit('confirmclick',false)
					uni.$emit('changeinfo',1)
				}).catch(res=>{
					
				})
			},
			cancelclick(){
				this.$emit('cancelclick',false)
			},
			confirmclick(){
				this.changeinfo()
			},
		}
	}
</script>

<style lang="scss">
.popbox {
			padding: 40rpx 40rpx 100rpx;
			width: 686rpx;
			margin: 0 auto;
			background-color: #f4f4f4;
			box-sizing: border-box;

			/deep/ uni-scroll-view {
				width: 100%;
				height: 150px;
			}

			/deep/ .uni-section {
				background-color: #f4f4f4 !important;
			}

			.inputbox {
				@include flex input {
					text-align: left;
				}
			}
			.twobtn{
				@include flex;
				justify-content: space-around;
				.cancel{
					background-color: rgb(230, 230, 230);
					padding: 20rpx 40rpx;
				}
				.confirm{
					background-color: $mian-bg;
					padding: 20rpx 40rpx;
				}
			}
		}
</style>